<template>
	<view>
		<u-empty :show="showEmpty" text="暂无数据" mode="list">
		</u-empty>
		<view class="u-padding-20 u-rela u-border-bottom" v-for="(item, index) in messageList" @click="messagedetail(item.id)">
			<u-icon class="img_ava va_m" name="volume-fill" color="#ff5500" size="45"></u-icon>
			<!-- <image class="img_ava va_m u-margin-right-20" :src="item.image" mode="heightFix"></image> -->
			<!-- <text class="u-abso dis_inl_blo num_notice"></text> -->
			
			<view class="right_con dis_inl_blo va_m">
				<text style="float: right;" class="time">{{item.time}}</text>
				<text class="u-font-14">{{item.content}}</text>
				
				<view class="message_com dis_inl_blo">
					您有1条新的消息通知
				</view>
				
			</view>
			
		</view>
		<view v-if="type==2 || type==1" class="fabu" @click="releaseNotice">
			<image src="../../static/release.png" mode="heightFix"></image>
			<!-- <u-icon style="margin-top:20rpx;" name="../../../static/release.png" size="58"></u-icon> -->
		</view>
	</view>
</template>

<script>
	import cookie from "@/util/store/cookie"
	import {
		getNoticeList
	} from "@/service/indexService.js";
	export default{
		data (){
			return {
				showEmpty:false,
				messageList:[],
				type:0,
				limit:10,
				page:2
			}
		},
		onLoad() {
			this.type=cookie.get('type')
		},
		onReachBottom() {
			getNoticeList({
				type: 2,
				limit:this.limit,
				page:this.page
			}).then(res=>{
				// console.log(res);
				if(res.code==200){
					if(res.result.length==0){
						this.$refs.uToast.show({
						
							type: 'error',
							title: '没有更多啦',
							icon:false
							// message: e.msg,
						})
					}else{
						let list = res.result;
						list.forEach((item) => {
							this.messageList.push(item);
						})
						this.page++;
					}
					
				}else {
					this.$refs.uToast.show({
						type: 'error',
						title: '没有更多啦',
						icon:false
						// message: res.msg,
					})
				}
			});
		},
		onShow() {
			getNoticeList({
				type:2
			}).then(this.getNoticeList);
		},
		methods:{
			getNoticeList(e) {
				if (e.code == 200) {
					this.messageList = e.result;
					if(e.result.length==0){
						this.showEmpty = true;
					}else{
						this.showEmpty = false;
					}
				} else {
					this.showEmpty = true;
					this.messageList = [];
				}
			},
			messagedetail:function(id){
				uni.navigateTo({
					url:'./noticeDetail?id='+id
				})
			},
			releaseNotice:function(){
				uni.navigateTo({
					url:'./releaseNotice'
				})
			}
		},
		
	}
</script>

<style lang="scss">
	.img_ava{
		width:80rpx;
		height:80rpx;
		border-radius: 50%;
	}
	.num_notice{
		font-size: 20rpx;
		color:#fff;
		width:18rpx;
		height:18rpx;
		line-height: 35rpx;
		text-align: center;
		border-radius: 50%;
		top:30rpx;
		left:60rpx;
		background-color: #18B566;
	}
	
	.time{
		color:#666;
		font-size: 25rpx;
	}
	.right_con{
		width:87%;
	}
	.message_com{
		color:#666;
		clear: both;
		font-size: 25rpx;
		letter-spacing:3rpx;
		margin-top:10rpx;
		overflow: hidden;
		-webkit-line-clamp:2;
		text-overflow: ellipsis;
		display:-webkit-box;
		-webkit-box-orient: vertical;
	}
	.fabu{
		position: fixed;
		bottom:150rpx;
		right:30rpx;
		width:100rpx;
		height:100rpx;
		// text-align: center;
		border-radius: 50%;
		// background-color:#006971;
	}
	.fabu image{
		width:100rpx;
		height:100rpx;
	}
</style>
